<template>
	<view class="content">
		<view class="gift-box" v-for="(item,index) in pageResult.list" :key="index" @click="jump('gift_view', item.id)">
			<image class="gift-img" :src="item.picture" mode=""></image>
			<view class="gift-right">
				<view class="gift-title">{{item.title}} </view>
				<view class="gift-subTitle"> {{item.sub_title}} </view>
				<view class="gift-time"> {{item.created_at}} </view>
			</view>
		</view>
	</view>
</template>

<script>
	import serve from '../static/request.js';
	import storage from '../static/appkey.js';
	import common from '../static/jump.js';
	export default {
		data() {
			return {
				pageParam: {
					appkey: uni.getStorageSync('appkey'),
					merchantId: 0,
					page: 0,
					pageSize: 10
				},
				pageResult: {
					list: [],
					isEmpty: false,
					isEnd: false,
				},
			}
		},
		methods: {
			getList() {
				var self = this;
				self.pageParam.page ++;
				serve
					.request({
						url: '/marketing/gift-bag/list',
						data: self.pageParam
					})
					.then(res => {
						if (res.data && res.data.length > 0) {
							self.pageResult.list = self.pageResult.list.concat(res.data);
						}
						self.pageResult.isEmpty = self.pageResult.list.length == 0;
						self.pageResult.isEnd = res.data.length == 0;
					});
			},
			jump(jump_type, jump_link) {
				common.jump(jump_type, jump_link);
			}
		},
		onLoad(option) {
			this.pageParam.merchantId = option.merchantId || 0;
			this.pageParam.page = 0;
			this.pageResult.list = [];
			this.getList();
		},
		onShow() {
			// this.getList();
		},
		onPullDownRefresh() {
			this.pageParam.page = 0;
			this.pageResult.list = [];
			this.getList();
		},
		onReachBottom() {
			if (this.pageResult.isEnd || this.pageResult.isEmpty) {
				return
			}
			this.getList()
		}
	}
</script>

<style scoped lang="scss">
	.content{
		
	}
	.gift-box{
		padding: 30rpx;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		border-bottom: 2rpx solid #e4e4e4;
	}
	
	.gift-img{
		width: 200rpx;
		height: 200rpx;
	}
	.gift-right{
		margin-left: 30rpx;
		width: 454rpx;
	}
	.gift-title{
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		line-height: 80rpx;
		height: 80rpx;
		color: #333;
		font-size: 36rpx;
	}
	.gift-subTitle{
		font-size: 32rpx;
		line-height: 50rpx;
		height: 100rpx;
		color: #333;
		-webkit-line-clamp: 2;
		overflow: hidden;
		word-break: break-all;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
	}
	.gift-time{
		color: #aaa;
		font-size: 28rpx;
		margin-top: 20rpx;
	}
	
	
</style>
